<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="author" content="100200cs"/>

    <title>首页&lt;/a&gt;</title>

    <!--<link rel="stylesheet" href="./static/lib/diygw-mobile-all.min.css" />-->
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">

    <style type="text/css">

        a:-webkit-any-link{
            color:#000000;
            text-decoration: none;
        }

        .weui-tabbar {
            display: flex;
            position: absolute;
            z-index: 500;
            bottom: 0;

            background-color: rgb(255, 255, 255);
            width: 100%;
            left:0;
            right: 0;
            height: 63px;
            border-top: 1px solid #C0BFC4;
        }

        .weui-tabbar__item {
            display: block;
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
            padding: 5px 0 0;
            font-size: 0;
            color: #999999;
            text-align: center;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        }

        .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon, .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon > i, .weui-tabbar__item.weui-bar__item_on .weui-tabbar__label {
            color: #09BB07;
        }

        .weui-tabbar__icon {
            display: inline-block;
            width: 27px;
            height: 27px;
        }

        i.weui-tabbar__icon, .weui-tabbar__icon > i {
            font-size: 24px;
            color: #999999;
        }

        .weui-tabbar__icon img {
            width: 100%;
            height: 100%;
        }

        .weui-tabbar__label {
            text-align: center;
            color: #999999;
            font-size: 10px;
            line-height: 1.8;
            margin-top: 0;
        }


        .weui-tabbar {
            position: fixed;
        }

        .top, .page, .bottom {
            position: absolute;
            left: 0;
            right: 0;
        }

        .top {
            top: 0;
            bottom: 0;
            z-index: 1;
            height: 40px;
        }

        .page {
            top: 40px;
            bottom: 63px;
            overflow-y: scroll;
            overflow-x: hidden;
        }

        .bottom {
            bottom: 0;
            z-index: 1;
            min-height: 40px;
        }

        .back::before {
            border-color: #fff;
            border-style: solid;
            border-width: 0 0 2px 2px;
            content: " ";
            display: inline-block;
            height: 8px;
            left: 2px;
            margin-top: -4px;
            position: absolute;
            top: 50%;
            transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
            width: 8px;
        }

        .back {
            color: #fff;
            left: 5px;
            padding-left: 13px;
            position: absolute;
            text-align: right;
            top: 2px;
            display: none;
        }

        .page, body {
            background-color: #f8f8f8;
        }

        .container {
            overflow: hidden;
        }

        .page__title {
            padding: 0px;
            background: #000;
            text-align: center;
            color: #fff;
            z-index: 2;
            position: fixed;
            top: 0;
            left: 0;
            height: 40px;
            line-height: 40px;
            width: 100%;
            font-size: 16px;
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            background-color: #4da39a;
            margin: 0px
        }

        .weui-loadmore {
            width: 65%;
            margin: 1.5em auto;
            line-height: 1.6em;
            font-size: 14px;
            text-align: center;
        }

        .weui-loadmore__tips {
            display: inline-block;
            vertical-align: middle;
        }

        .weui-loadmore_line {
            border-top: 1px solid #E5E5E5;
            margin-top: 2.4em;
        }

        .weui-loadmore_line .weui-loadmore__tips {
            position: relative;
            top: -0.9em;
            padding: 0 .55em;
            background-color: #FFFFFF;
            color: #999999;
        }

        .weui-loadmore_dot .weui-loadmore__tips {
            padding: 0 .16em;
        }

        .weui-loadmore_dot .weui-loadmore__tips:before {
            content: " ";
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background-color: #E5E5E5;
            display: inline-block;
            position: relative;
            vertical-align: 0;
            top: -0.16em;
        }

    </style>

    <script charset="utf-8" type="text/javascript" src="./js/jquery-1.6.4.min.js"></script>
    <script charset="utf-8" type="text/javascript" src="./js/temp.js"></script>

<script type="text/javascript">
    var favor_do=function (id) {
        console.log("favor_do "+id);
        $("#favor_done_"+id).children("span").text(" "+100);
        $("#favor_"+id).css('display',"none");
        $("#favor_done_"+id).css('display',"block");
    }
    var favor_cancle=function (id) {
        console.log("favor_cancle "+id);
        $("#favor_"+id).children("span").text(" "+99);
        $("#favor_done_"+id).css('display',"none");
        $("#favor_"+id).css('display',"block");
    }
</script>

</head>

<body>


<div class="container">
    <div class="top">
        <div onclick="javascript:history.back(-1);"
             style="color: #ffffff;z-index: 3;height: 40px;width: 30px;
    text-align: center;font-size: 20px;position: absolute;cursor: pointer">

        <i class="fa fa-chevron-left" style="margin-top: 11px"></i>
        </div>
        <h1 class="page__title" >首页</h1>
    </div>

    <div class="page" id="page">

        <div id="infinite888" class="weui-container">
            <div id="content1">
                <script type="text/template" id="tmp111">
                    <div class="published-item" style="background-color: #ffffff">
                        <div class="published-item-top">
                            <div style="float: left">
                                <a href="user_detail">
                                <img src="{{img_url}}" class="weui-media-box__thumb"
                                     style="float:left;margin-top:5px;margin-left: 10px;margin-right:5px;height:40px;width: 40px;border-radius: 50%;object-fit: cover">
                                </a>
                                <a href="content_detail" style="float: left">
                                <div style="margin-top: 8px;width: 150px;height: 18px;
                                        overflow: hidden;
                                display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;word-break: break-all">
                                    <h5 style="margin: 0;"><span>我笔记本文件比较完备的课程表上课的地盘</span></h5>

                                </div>
                                <div style="margin-top:5px;font-size: 10px;
                                        height: 12px;color:#999;
                                        overflow: hidden;width: 150px;
                                         display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;word-break: break-all">
                                    <span>2008</span>
                                </div>
                                </a>
                            </div>
                            <div class="zhiding" style="margin-left:-4px;display: block">
                                <div style="float:right;width: 0;
                                    height: 0;
                                    border-top: 32px solid rgb(255,85,85);
                                    border-left: 30px solid transparent; ">
                                </div>
                                <div style="float:right;transform:rotate(46deg);font-size: 10px;
                                        margin-top: 4px;margin-right: -29px;color: rgb(255,255,255)">
                                    <span>置顶</span>
                                </div>
                            </div>
                            <a href="connect_user">
                            <div style="margin-right:4px;margin-top:14px;width: 40px;float: right;color: #ff0001;font-size: 12px;border: 1px solid #ff0001;padding: 2px;
                                    border-radius: 4px;">
                                <span>联系Ta</span>

                            </div>
                            </a>
                            <div style="clear: both"></div>
                        </div>
                        <a href="content_detail">
                        <div class="pulished-item-content" style="margin-left: 10px;margin-right:6px;font-size: 18px;
                                            overflow: hidden;
                                        -webkit-line-clamp: 4;
                                        display: -webkit-box;
                                        -webkit-box-orient: vertical;
                                        word-break: break-all;">
                            <h1 style="margin-top:2px;margin-bottom:2px;font: inherit">
                                #推广#我就看不见好成绩和背景gfjhjbdfwbmbnf.mne.,mngfemwbnembnen.krgnk.jengbv.wb.kgew.kner课本费科技部网络空间而法律框架外轮廓我和口碑付款金额我看进步而分开基本会计报告 调查表呼叫失败的刺激不打算买车不觉得不我就把我叫你把我你定吧我基本都是基本具备的解放碑比较好的办事11
                            </h1>
                        </div>
                        <div class="published-item-images" style="position:relative;width:100%;height:0;padding-bottom:33%;">
                            <div style="height: 100%;position: absolute">
                                <div style="height:100%;width:32%;float: left;margin-right: 1%;;margin-left: 1%">
                                    <img src="{{img_url}}" class="weui-media-box__thumb"
                                         style="width: 100%;height:100%;border-radius: 2px;object-fit: cover">
                                </div>
                                <div style="height:100%;width:32%;float: left;margin-right: 1%">
                                    <img src="{{img_url}}" class="weui-media-box__thumb"
                                         style="width: 100%;height:100%;border-radius: 2px;object-fit: cover">
                                </div>
                                <div style="height:100%;width:32%;float: left;">
                                    <img src="{{img_url}}" class="weui-media-box__thumb"
                                         style="width: 100%;height:100%;border-radius: 2px;object-fit: cover">
                                    <div style="text-align: center;color: rgba(255,255,255,0.9);font-size: 40px;
                                    ;position:absolute;top:0;z-index:100;width: 32%;height:100%;border-radius: 2px;background-color: rgba(0,0,0,0.51);">
                                        <div style=" position:absolute;left: 50%; top: 50%;transform: translate(-50%, -50%);">+6</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        </a>

                        <div style="margin-bottom:8px;">
                            <div class="published-item-location" style="margin-left:13px;margin-bottom:5px;color: #888888">
                                <i class="fa fa-map-marker"></i><span> 广河县</span>
                            </div>
                            <div class="published-item-watchnumber" style="float:left;margin-left:10px;color: #888888">
                                <i class="fa fa-eye"></i><span> 0</span>

                            </div>
                            <div id="favor_{{item_id}}" class="published-item-favor" onclick="favor_do({{item_id}})"
                                 style="float:left;margin-left:80px;color: #888888;cursor: pointer;">
                                <i class="fa fa-thumbs-o-up"></i><span class="num"> 0</span>
                            </div>

                            <div id="favor_done_{{item_id}}" class="published-item-favor-done" onclick="favor_cancle({{item_id}})"
                                 style="display:none;float:left;margin-left:80px;color: #3fd3d2;cursor: pointer;">
                                <i class="fa fa-thumbs-up"></i><span class="num"> 0</span>
                            </div>
                            <a href="share_it">
                            <div class="published-item-share" style="float:left;margin-left:80px;color: #888888">
                                <i class="fa fa-share-alt"></i><span> 分享</span>
                            </div>
                            </a>
                            <div style="margin-bottom:10px;clear: left"></div>

                        </div>
                    </div>
                </script>
            </div>

            <div class="weui-loadmore weui-loadmore-17628">
                <img class="weui-loading" src="./assets/images/load2.gif" style="vertical-align: middle;">

                <span class="weui-loadmore__tips weui-loadmore_data">正在加载中</span>
                <span class="weui-loadmore__tips weui-loadmore_nodata hide">没有更多内容了哟</span>
            </div>
        </div>


    </div>
    <div class="weui-tabbar" id="tabbar252825">
        <a href="index.html" page="index" class="weui-tabbar__item ajax-page  weui-bar__item_on ">
            <img src="./assets/images/1503240837355.png" img="./assets/images/1503241189268.png"
                 selectimg="./assets/images/1503240837355.png" alt="" class="weui-tabbar__icon"
                 style="height:40px;width:40px"/>
            <p class="weui-tabbar__label">首页</p></a>
        <a href="productcenter.html" page="productcenter" class="weui-tabbar__item ajax-page "> <img
                src="./assets/images/1503241189561.png" img="./assets/images/1503241189561.png"
                selectimg="./assets/images/1503240840602.png" alt="" class="weui-tabbar__icon"
                style="height:40px;width:40px"/>
            <p class="weui-tabbar__label">产品展示</p></a>
        <a href="newscenter.html" page="newscenter" class="weui-tabbar__item ajax-page "> <img
                src="./assets/images/1503241183727.png" img="./assets/images/1503241183727.png"
                selectimg="./assets/images/1503240843400.png" alt="" class="weui-tabbar__icon"
                style="height:40px;width:40px"/>
            <p class="weui-tabbar__label">新闻中心</p></a>
        <a href="about.html" page="about" class="weui-tabbar__item ajax-page "> <img
                src="./assets/images/1503241185952.png" img="./assets/images/1503241185952.png"
                selectimg="./assets/images/1503240845838.png" alt="" class="weui-tabbar__icon"
                style="height:40px;width:40px"/>
            <p class="weui-tabbar__label">关于我们</p></a>
        <style type="text/css">
            .weui-tabbar__label {
                color: #999999;
            }

            .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon,
            .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon > i,
            .weui-tabbar__item.weui-bar__item_on .weui-tabbar__label {
                color: #0ac908;
            }
        </style>
    </div>

</div>
</body>

<script charset="utf-8" type="text/javascript">
    var news_id = 1;
    var item_id = 1;
    var isget = true;
    var container111 = new getTemplate('tmp111');
    $(".weui-loadmore_nodata").hide();

    var getData = function () {
        $.ajax({

            url: 'jsondata2',//url

            data: {id: news_id},

            type: 'POST',// 'POST' or 'GET'

            dataType: 'json',//'json' or 'text' or 'html'

            success: function (data) {
                for (j = 0; j < data['count']; j++) {
                    container111.setValue(data[j]);
                    container111.assign("item_id",item_id);
                    container111.append('#content1');
                    item_id+=1;
                }

                isget = true;
                ;

            }
        });
        news_id += 1;
    }

    for (i = 0; i < 2; i++) {
        getData();
    }

    $("#page").scroll(function () {

        var scrollPos = $(this).scrollTop();
        var dbHiht = $(this).height();

        // console.log("scrollPos:" + scrollPos + "  dbHiht:" + dbHiht + " $(this).height():" + $("#infinite888").height());
        // console.log("pp:" + (-dbHiht - scrollPos + $("#infinite888").height()))
        if (-dbHiht - scrollPos + $("#infinite888").height() < 1 && isget) {
            //这里执行滚动条到页面底部时的操作
            isget = false;
            getData();
            // $('.published-item-images').height=0.33* $('.published-item-images').width;

        }

    })


</script>


</html>